<template>
	<view>
		<uni-list :border="false">
			<uni-list-chat :border="false" :title="info.title" :avatar="info.img" ></uni-list-chat>
		</uni-list>
		<view class="brief">
			<text>{{info.create_time}}</text> <text>|</text> <text>{{info.click}}次观看</text>
		</view>
		<view class="view-line"></view>
		<view class="content">
			<view v-html="info.content"></view>
		</view>
		<uni-section :title="'共'+common.count+'条评论'" type="line" padding>
			<uni-list>
				<uni-list-item v-for="item in common.list" :key="item.id" :title="item.publish_user.name" :note="item.content" :thumb="item.publish_user.head_img" thumb-size="lg">
					<template v-slot:footer>
						<view class="text-right"><uni-icons type="hand-up" size="20"></uni-icons>{{item.likes}}</view>
					</template>
				</uni-list-item>
			</uni-list>
		</uni-section>
		<view class="fixed-bottom">
			<uni-goods-nav :fill="true" :options="options" :button-group="customButtonGroup" @click="onClick" @buttonClick="buttonClick" />
		</view>
		
		<uni-popup ref="popup" background-color="#fff">
			<view class="overflow-y" v-if="!info.auth">
				<uni-card padding="0" spacing="0">
					<template v-slot:cover>
						<view class="p8">
							<uni-title type="h3" :title="'订单：'+info.title"></uni-title>
						</view>
					</template>
					<uni-list>
						<uni-list-item :title="'订单金额：' + info.order_pay"></uni-list-item>
						<uni-list-item :title="'需要支付：' + info.order_pay"></uni-list-item>
						<uni-list-item :title="'剩余积分：' + user_integral"></uni-list-item>
					</uni-list>
				</uni-card>
				<view class="p15 text-center"><button class="default-button-push" @click="onPay">立即支付</button></view>
			</view>
			<view v-else class="overflow-y">
				<uni-card padding="0" spacing="0">
					<template v-slot:cover>
						<view class="p8">
							<uni-title type="h3" :title="'资料：'+info.title"></uni-title>
						</view>
					</template>
					<uni-list>
						<uni-list-item :title="'网盘' + pan"></uni-list-item>
					</uni-list>
				</uni-card>
				<view class="p15 text-center"><button class="default-button-push" @click="onDown">复制链接</button></view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				options: [{
					icon: 'hand-up',
					text: '点赞',
					info:0,
					infoColor: "#333",
					infoBackgroundColor: '#EEE',
					type:'like',
				}, {
					icon: 'star',
					text: '收藏',
					info:0,
					infoColor: "#333",
					infoBackgroundColor: '#EEE',
					type:'collect'
				}],
				customButtonGroup: [
					{ icon: 'search',type: 'bigimage',text: '查看大图', backgroundColor: '#FFD101', color: '#333' },
					{ icon: 'shop',type: 'shop',text: '模型下载', backgroundColor: '#ffab02', color: '#333' },
				],
				id:0,
				form:{page:1},
				info:{img:'',title:'',create_time:'',click_um:0,content:''},
				pan:'',
				common:{list:[],count:0,num:10,page:1},
				form_common:{content:''},
				user_integral:0,
				
				shareinfo:{title:'',img:'',path:''}
			}
		},
		onLoad(options){
			// https://api.xinzhuvip.com/xs/node_download
			this.id = options.id
			this.onGetInfo()
		},
		methods: {
			onPay(){
				//先判断积分是否足够
				if(this.user_integral < this.info.integral){
					uni.showToast({title: '积分不足',icon: 'none'});
					return
				}
				let _this = this
				this.$request_api('applet_api/pay','POST',{id:this.id,type:'node'}).then(res => {
					if(res.code == 201){
						uni.showToast({ title: res.msg, duration: 2000,icon: 'none' })
						_this.onGetInfo()
						return;
					}
					if(res.code != 200){
						uni.showToast({ title: res.msg, duration: 2000,icon: 'none' })
						return
					}
					let paymentData = res.data;
					wx.requestPayment({
						nonceStr:paymentData.nonceStr,
						package: paymentData.package,
						paySign: paymentData.paySign,
						timeStamp: paymentData.timeStamp,
						signType:paymentData.signType,
					})
					this.$refs.popup.close()
					_this.isPay(res.no)
				}).catch(err => {
					console.log(err)
				})
			},
			isPay(no){
				let _this = this
				this.$request_api('applet_api/ispay','POST',{no:no}).then(res => {
					if(res.data){
						this.onGetInfo()
						return
					}
					setTimeout(() => {_this.isPay(no)}, 3000);
				}).catch(err => {
					console.log(err)
				})
			},
			onGetInfo(){
				let _this = this
				this.$request_api('applet_api/node/info/'+_this.id,'GET').then(res => {
					res.data.content = _this.$func.onImgStyle(res.data.centent);
					// res.data.content = res.data.centent.replace(/\<img/gi, '<img style="width:100%;height:auto"');
					res.data.order_pay = '￥' + res.data.price + '元;' + res.data.integral + '积分'
					_this.info = res.data
					_this.options[0].info = _this.info.likes_count
					_this.options[1].info = _this.info.collects_count
					
					_this.shareinfo.title = _this.info.title
					_this.shareinfo.img = res.data.img
				}).catch(err => {
					console.log(err)
				})
			},
			onLike(){
				let _this = this
				this.$request_api('applet_api/node/like','POST',{id:_this.id}).then(res => {
					if(res.code == 200){
						_this.onGetInfo()
					}
				}).catch(err => {
					console.log(err)
				})
			},
			onCollect(){
				let _this = this
				this.$request_api('applet_api/node/collect','POST',{id:_this.id}).then(res => {
					if(res.code == 200){
						_this.onGetInfo()
					}
				}).catch(err => {
					console.log(err)
				})
			},
			onClick(e) {
				if(e.content.type == 'like'){
					this.onLike()
				}
				if(e.content.type == 'collect'){
					this.onCollect()
				}
			},
			buttonClick(e) {
				let _this = this
				if(e.content.type == 'bigimage'){
					this.$func.bigImage(this.info.content)
					return
				}
				
				if(this.info.auth){
					_this.pan = this.info.pan
					_this.$refs.popup.open('bottom')
				}else{
					this.$request_api('applet_api/user/integral','get').then(res => {
						_this.user_integral = res.data
						_this.$refs.popup.open('bottom')
					}).catch(err => {
						console.log(err)
					})
				}
			},
			onDown(){
				uni.setClipboardData({
					data: '下载'+this.pan,
					success: () => {
						uni.showToast({title: '复制成功',icon: 'success',duration: 2000});
					},
					fail: () => {
						uni.showToast({title: '复制失败',icon: 'none'});
					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
.brief text{margin-left: 15px;font-size: .8rem;color: #666;}
.content{padding: 15px 15px 15px 15px;}
.fixed-bottom{background-color: #FFF;}
.down{padding-bottom: 60px;}
</style>
